import { reactive } from '@vue/reactivity'
import axios from 'axios'

interface DataProp<T> {
  result: null | T;
  loading: boolean;
  loaded: boolean;
  error: any;
}
const useURLLoader = <T>(url: string) => {
  const data = reactive<DataProp<T>>({
    result: null,
    loading: true,
    loaded: false,
    error: null
  })
  axios
    .get(url)
    .then(resp => {
      data.result = resp.data
      data.loaded = true
    })
    .catch(error => {
      data.error = error
    })
    .finally(() => {
      data.loading = false
    })

  return data
}
export default useURLLoader
